<template>
  <div class="registeredAccountList">
    <div class="titleTop first">
      <!-- v-if="this.$store.state.user.userInfo.memberRole === 'teacher'" -->
      <a-button type="primary" @click="createCourse">{{$t('navigation.course_create')}}</a-button>
    </div>
    <div class="content">
      <CountCard :dataList="menus" @search="setSearch" :status="auditsStatus"/>
      <course-table :data="data" fromPage="myCourseList" :pagination="pagination" @update="setOptions" :loading="loading" @addAcct="(record) => addAcct(record, true)" :selectedRowKeys="selectedRowKeys" @setSelected="setSelected"></course-table>
    </div>
  </div>
</template>

<script>
import CountCard from '@/components/CountCard/CountCard'
import CourseTable from '@/components/Config/CourseTable'
import { findAllCourse, countCourse } from '@/api/config'
// import { consolidateDetailByTarget } from '@/api/employingUnit'
import { twoArrCludes } from '@/util/roles'
export default {
  name: 'registeredAccountList',
  components: { CourseTable, CountCard },
  data () {
    return {
      mergeCompany: [],
      mergeManage: false,
      searchField: {},
      menus: [],
      data: [],
      selectedRowKeys: [],
      auditsStatus: 'ALL',
      // isActivation: '',
      loading: false,
      showAddAcct: false,
      record: null,
      pagination: {
        total: 0,
        simple: true,
        current: 1,
        pageSize: 10
      }
      // columns: [
      //   {
      //     title: '会员类别',
      //     dataIndex: 'memberRole',
      //     key: 'memberRole',
      //     scopedSlots: { customRender: 'memberRole' }
      //   },
      //   {
      //     title: '学科委员会',
      //     dataIndex: 'subject',
      //     key: 'subject',
      //     scopedSlots: { customRender: 'subject' }
      //   },
      //   {
      //     title: '姓名',
      //     dataIndex: 'name',
      //     key: 'name',
      //     scopedSlots: { customRender: 'name' }
      //   },
      //   {
      //     title: '性别',
      //     dataIndex: 'gender',
      //     key: 'gender',
      //     scopedSlots: { customRender: 'gender' }
      //   },
      //   {
      //     title: '电话',
      //     dataIndex: 'phone',
      //     key: 'phone'
      //   },
      //   {
      //     title: '邮箱',
      //     dataIndex: 'email',
      //     key: 'email'
      //   },
      //   {
      //     title: '出生日期',
      //     dataIndex: 'birth',
      //     key: 'birth'
      //   },
      //   {
      //     title: '所在城市',
      //     dataIndex: 'city',
      //     key: 'city'
      //   },
      //   {
      //     title: '审核状态',
      //     dataIndex: 'action',
      //     key: 'action',
      //     scopedSlots: { customRender: 'action' }
      //   },
      //   {
      //     title: '操作',
      //     dataIndex: 'action1',
      //     key: 'action1',
      //     scopedSlots: { customRender: 'action1' }
      //   }
      // ]
    }
  },
  created () {
    this.auditsStatus = this.$route.query.auditsStatus || 'ALL'
    this.setOptions()
  },
  watch: {
    $route: {
      handler (val, oldVal) {
        // if (val.query.auditsStatus !== oldVal.query.auditsStatus) {
        this.auditsStatus = val.query.auditsStatus || val.query.status || 'ALL'
        this.getList()
        // }
      }
    }
  },
  methods: {
    twoArrCludes,
    oprateMerge ({ flag, type }) {
      if (type) {
        // this.consolidateDetailByTarget()
      }
      this.mergeManage = flag
    },
    setSelected (selectedRowKeys) {
      this.selectedRowKeys = selectedRowKeys
    },
    addAcct (record, flag, type) {
      this.record = record
      if (type) {
        this.getCount()
        this.getList()
      }
      this.showAddAcct = flag
    },
    setSearch (item) {
      console.info(item)
      this.$router.push({ query: { [item.param]: item.key } })
    },
    setOptions (data) {
      this.searchField = data ? data.searchField : {}
      this.pagination.current = data && data.pagination ? data.pagination.current : 1
      this.getCount()
      this.getList()
    },
    async getCount () {
      let params = { operate: 'normalSearch', creatorId: this.$store.state.user.userInfo.id }
      let res = await countCourse(params)
      this.menus = res.data.map(t => {
        if (['ALL', 'WAIT', 'PASS', 'NOTPASS'].includes(t.key)) {
          t.param = 'auditsStatus'
        } else {
          t.param = 'status'
        }
        return t
      }).filter(t => ['ALL', 'WAIT', 'PASS', 'NOTPASS', 'CANCELLED'].includes(t.key))
      // this.menus = [
      //   {
      //     name: '全部',
      //     key: 'ALL',
      //     value: 2
      //   },
      //   {
      //     name: '待审核',
      //     key: 'NEW',
      //     value: 2
      //   },
      //   {
      //     name: '招募中',
      //     key: 'RECRUITING',
      //     value: 2
      //   },
      //   {
      //     name: '待开始',
      //     key: 'WAIT',
      //     value: 2
      //   },
      //   {
      //     name: '进行中',
      //     key: 'PROCESSING',
      //     value: 0
      //   },
      //   {
      //     name: '已结束',
      //     key: 'COMPLETED',
      //     value: 0
      //   },
      //   {
      //     name: '已取消',
      //     key: 'CANCELLED',
      //     value: 0
      //   }
      // ]
    },
    // async consolidateDetailByTarget () {
    //   let res = await consolidateDetailByTarget()
    //   if (res.code === 200) {
    //     this.mergeCompany = res.data
    //   } else {
    //     // this.$message.error(res.message)
    //   }
    // },
    async getList () {
      this.loading = true
      this.selectedRowKeys = []
      let params = {
        creatorId: this.$store.state.user.userInfo.id,
        operate: 'normalSearch',
        // auditsStatus: this.auditsStatus === 'ALL' ? '' : this.auditsStatus,
        pageSize: this.pagination.pageSize,
        pageNum: this.pagination.current,
        name: this.searchField.key,
        ...this.searchField
        // userRole: 'ROLE_VENDOR'
      }
      if (this.$route.query.status) {
        params.status = this.auditsStatus === 'ALL' ? '' : this.auditsStatus
      } else {
        params.auditsStatus = this.auditsStatus === 'ALL' ? '' : this.auditsStatus
      }
      let res = await findAllCourse(params)
      if (res.code === 200) {
        this.data = res.data.items
        this.$set(this.pagination, 'total', res.data.totalCount)
      } else {
        this.$message.error(res.message)
      }
      this.loading = false
    },
    createCourse () {
      this.$router.push('/course/courseEdit')
    }
  }
}
</script>

<style lang="stylus" scoped>
@import '../../styles/var.styl'
.registeredAccountList
  .titleTop
    background #fff
    display flex
    align-items center
    justify-content flex-start
    padding  0 24px 12px
    h3
      margin-right 24px
      font-size 18px
      font-weight bold
  .content
    padding 12px 24px
  :global(.CandidateTable)
    margin-top 12px
</style>
